<!--
 * @Author: hu_binbin
 * @Date: 2021-08-23 19:18:27
 * @LastEditTime: 2021-08-23 21:49:36
 * @Description: 作废操作票
-->
<template>
	<article class="bg_4dbfae">
		<Theader :title="title">
			<template slot="header_arrow">
				<van-icon size="25" name="arrow-left" @click="$pageBack"/>
			</template>
        </Theader>
        <div style="overflow-y: auto;height: 100%;margin-top: 3.5rem;">
            <div style="background: #fff;margin: 0.2rem 0.7rem;padding-bottom: 2rem;">
                <div>
                    <van-row class="defe-des">作废原因:</van-row>
                    <div style="margin: 15px;border-radius: 5px;">
                        <van-field class="textarea-content" disable v-model.trim="taskDetail.remark" rows="5" autosize type="textarea"
                            placeholder="请输入作废原因">
                            <template slot="right-icon">
                                <van-image :src="icon.audio" width="20" height="20"></van-image>
                            </template>
                        </van-field>
                    </div>
                </div>
                <div style="margin: 2rem 0;">
                    <van-row class="defe-des">
                        <span style="color:red">*</span>
                        作废人签名:
                    </van-row>
                    <div class="defe-des">
                        <van-image width="50" height="50" :src="icon.screen"></van-image>
                    </div>
                </div>
                <div style="margin: 2rem 0;">
                    <van-row class="defe-des">
                        <span style="color:red">*</span>
                        作废时间:
                    </van-row>
                    <div class="defe-des">
                        2021年09月01日08时32分
                    </div>
                </div>
            </div>
            
            
        </div>
        <!--底部按钮-->
        <div class="btn">
            <van-button color="#17B49B" @click="submitFile" style="width: 80%;" size="small" type="primary">作废提交</van-button>
        </div>

	</article>
</template>
<script>
	import Theader from "../component/header"
	export default {
		name: "abolish",
		components:{
			Theader,
		},
		data() {
			return {
                title: "作废操作票",
                icon: {
					rfid:require('../../../../assets/tour/icon-rfid.png'),
					scan:require('../../../../assets/tour/icon-scan.png'),
					screen:require('../../../../assets/tour/icon-screen.png'),
                    add:require('../../../../assets/tour/icon-add.png'),
                    audio:require('../../../../assets/tour/audio.png'),
                },
                taskDetail:{
                    remark: "",
                }
			}
		},
		computed: {

		},
		methods: {
            back(){
                this.$router.go(-1)
            },
            //rifid 
            rfidBtn() {

            },
            focus() {
                
            },
            //扫描二维码
            scanBtn() {

            },
            submitFile() {
                this.$router.push({
					name: "cycleReduceFileAlert",
				})
            }
		},
		watch: {
			
		},
		mounted() {

		}
	}
</script>
<style scoped>
	article {
		display: flex;
		flex-direction: column;
		height: 100vh;
	}
    .defe-des{
        color:#666;
        padding: 1rem 0 0 1rem;
        font-size:0.8rem;
    }
    .textarea-content{
        color:#333;
        font-size:0.875rem;
		border: 1px solid #E2E2E2;color:#999;
        padding-bottom: 1.5rem;
    }
    .textarea-content /deep/ .van-field__right-icon{
        position: absolute;
        bottom: -0.2rem;
        right: 0.5rem;
    }
    .btn{
        width: 100%;
        background: rgb(255, 255, 255);
        padding: 0.5rem 0px;
        position: fixed;
        bottom: 0;
        display: flex;
        justify-content: center;
    }
    
</style>


